<template>
   <!-- <Card>
        <Tabs :animated="false">
            <Tab-pane label="按分类">
                <category/>
            </Tab-pane>
            <Tab-pane label="按单位">
                <company/>
            </Tab-pane>
            <Tab-pane label="按时间">
                <statisticsTime/>
            </Tab-pane>
        </Tabs>
    </Card>-->
    <Layout class="menu-left">
        <Menu mode="horizontal" @on-select='lowerStep' :active-name="modaleshow">
            <MenuItem :name="1">按分类</MenuItem>
            <MenuItem :name="2">按单位</MenuItem>
            <MenuItem :name="3">按时间</MenuItem>
        </Menu>
        <Row v-show="modaleshow==1">
            <category/>
        </Row>
        <Row v-show="modaleshow==2">
            <company/>
        </Row>
        <Row v-show="modaleshow==3">
            <statisticsTime/>
        </Row>
    </Layout>
</template>

<script>
    import category from './category.vue'
    import company from './company.vue'
    import statisticsTime from './statisticsTime.vue'
    export default {
        name: "statistics",
        components: {category,company,statisticsTime},
        data(){
            return{
                modaleshow:1,
            }
        },
        methods:{
            lowerStep(name) {
                this.modaleshow=name
                // this.query()
            },
        }
    }
</script>

<style lang='css' scoped>
    @import '../../../../index.css';

</style>